<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html">
<head>
	
	<link rel="StyleSheet" type="text/css" href="#{facesContext.externalContext.requestContextPath}/style/estilos.css" media="screen" />
	<link rel="StyleSheet" type="text/css" href="#{facesContext.externalContext.requestContextPath}/style/menu.css" media="screen" />
	<script type="text/javascript" src="#{facesContext.externalContext.requestContextPath}/resources/jquery.js"></script>
	<script type="text/javascript" src="#{facesContext.externalContext.requestContextPath}/resources/menu.js"></script>
	<title>
		<ui:insert name="title">iContas</ui:insert>
	</title>
</head>
<body>
<!-- All (header, footer and content) are united here by this file, which is
	summarily included in home.html. See home.xhtml, indeed, see what is
	displayed in the rendered page, for the full explanation.
  -->
<div id="header">
  <ui:insert name="header">
    <ui:include src="header.xhtml"/>
  </ui:insert>
</div>

<h:form id="formulario">
	<div id="content">
		<ui:insert name="content">
			
			<div class="lang">
				<h:commandLink id="brazil">
					<h:graphicImage value="/images/pais/brazil.jpg" alt="Português" title="Português"/>
				</h:commandLink>
				<h:commandLink id="eua">
					<h:graphicImage value="/images/pais/eua.jpg" alt="English" title="English"/>
				</h:commandLink>
			</div>
			
		    <div class="cont cleft">
		    	<div>
			     	<span><h:graphicImage value="/images/account.jpg"/></span>
		    	</div>
		     	<div>
		     		<h4>Ainda não possui um usuário?</h4>
		     		<span><h:commandLink  id="criar" styleClass="esqueci">Criar conta</h:commandLink></span>
		     	</div>
		    </div>
		     
		    <div class="cont cright">
		     	<h3>Entrar</h3>
		     		
		     		<span class="rotulo">
						<h:outputLabel styleClass="rotulo" for="name" value="Usuário: "></h:outputLabel>
		     		</span>
					<h:inputText maxlength="50" value="" styleClass="caixa_f"/>
				
		     		<span class="rotulo">
			     		<h:outputLabel styleClass="rotulo" for="senha" value="Senha: "></h:outputLabel>
		     		</span>
					<h:inputText maxlength="50" value="" styleClass="caixa_f"/>
					
					<div>
						<h:selectManyCheckbox value="#{user.favNumber1}">
				   			<f:selectItem itemValue="1" itemLabel="Mantenha-me conectado" />
				   		</h:selectManyCheckbox>
			   		</div>
			   		
			   		<div>
			   			<h:commandButton id="submit" value="Enviar" styleClass="botao dir"> </h:commandButton>
			   		</div>
			   		<div>
				   		<span><h:commandLink  id="esqueci" styleClass="esqueci">Esqueci a senha</h:commandLink></span>
			   		</div>
			   		
			   		<div>
				   		<span><h:commandLink  id="alterar" styleClass="esqueci">Alterar</h:commandLink></span>
			   		</div>
		    </div>
		</ui:insert>
	</div>
</h:form>
<div id="footer">
	<ui:insert name="footer">
    	<ui:include src="footer.xhtml"/>
  	</ui:insert>
</div>
</body>
</html>